<template>
  <el-form ref="form" :model="formData" :rules="formRules" inline>
    <el-form-item>{{ charA(index) }}</el-form-item>
    <el-form-item prop="optionContent">
      <el-input v-model="formData.optionContent" type="textarea" :autosize="{minRows:1}" placeholder="请输入题目" clearable style="width:300px;"></el-input>
    </el-form-item>
    <el-form-item prop="scoreValue" style="width:60px;">
      <el-input v-model="formData.scoreValue" v-number-input.float placeholder="分值"></el-input>
    </el-form-item>
    <el-form-item prop="isEnter">
      <el-checkbox v-model="formData.isEnter" :true-label="1" :false-label="0">允许填空</el-checkbox>
    </el-form-item>
    <el-form-item>
      <svg-icon icon-class="shanchulajixiang-line" :class="$style.removeIcon" @click.stop="$emit('on-remove', index)"></svg-icon>
    </el-form-item>
  </el-form>
</template>
<script>
import { optionObj, charA } from '../../common'
export default {
  name: 'AnswerSelect',
  components: {
  },
  props: {
    value: {
      type: Object,
      default: optionObj()
    },
    index: {
      type: Number,
      default: 0
    }
  },
  data() {
    return {
      formData: {},
      formRules: {
        optionContent: [{ required: true, message: '请输入选项内容', trigger: 'change' }]
      }
    }
  },
  watch: {
    formData: {
      handler(n, o) {
        this.$emit('input', this.formData)
      },
      deep: true
    }
  },
  created() {
    const formData = optionObj()
    for (const k of Object.keys(formData)) {
      formData[k] = this.value[k]
    }
    this.formData = formData
  },
  methods: {
    charA
  }
}
</script>
<style lang="scss" module>
.removeIcon{
  color: red;
  cursor: pointer;
}
</style>
